<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>03.for-in与in操作的代理拦截</title>
    </head>
    <body>
        <script>
            /**
             * 1.做一个拦截器Proxy，用来拦截对象进行一些逻辑处理，
             * 注意这个Proxy拦截器目前只在火狐浏览器下实现了兼容
             * IE、Google、Safari、Opera都暂不支持，稍微注意下
             * 2.let proxy = new Proxy();有两个参数，如下
             * 1).第一个参数是需要被代理的对象
             * 2).第二个参数是代理的一些配置方法
             */
            // for in / in
            var obj = { 'name' : 'allen', '_name' : 'xiaoyou' };
            // var flag = 'name' in obj;
            // console.log(flag);

            var proxy = new Proxy (obj, {
                has (target, key) {
                    if ( key[0] === '_' ) {
                        return false;
                    } else {
                        return target[key];
                    }
                }
            });

            var flag1 = 'name' in proxy;
            var flag2 = '_name' in proxy;
            console.log(`has name ${flag1}`);
            console.log(`has _name ${flag2}`);

            console.log('-------------------**************---------------------');

            // for in
            var obj2 = {
                'name' : 'kaykay',
                '_name' : 'xiaokaykay',
                'age' : '3',
                'gender' : '男',
                'group' : 'nodejs'
            };

            var proxy2 = new Proxy (obj2, {
                enumerate : function (target) {
                    // 过滤掉带_的key类似_name的key
                    // 这里没有过滤到不知道啥原因，尴尬了，先搁置下
                    return Object.keys(target).filter(function (key) {
                        return key[0] !== '_';
                    })[Symbol.iterator]();
                }
            });

            // for in遍历
            for ( let key in proxy2 ) console.log(key, proxy2[key]);
        </script>
    </body>
</html>
